﻿<!doctype html>
<html>
<head>
    <title>SpreadJS - Formula</title>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

    <link href="../../../external/spreadjs/css/gcspread.sheets.excel2013white.9.40.20161.0.css" rel="stylesheet" type="text/css" />

    <script src="../../../external/external/jquery-1.8.2.min.js" type="text/javascript"></script>

    <script type="text/javascript" src="../../../external/spreadjs/gcspread.sheets.all.9.40.20161.0.min.js"></script>

    <style type="text/css">
        /*css_begin*/
        input[type="text"] {
            width: 100px;
            margin-right: 20px;
        }

        label {
            display:inline-block;
            width: 100px;
        }

        input[type="button"] {
            width: 100px;
        }
        /*css_end*/
    </style>

    <script id="scriptInit" type="text/javascript">
    /*code_begin*/
        $(document).ready(function () {
            var spread = new GcSpread.Sheets.Spread(document.getElementById("ss"));
            var sheet = spread.getSheet(0);
            sheet.isPaintSuspended(true);
            sheet.setArray(0, 0, [[1, 1, 1], [2, 2, 2], [3, 3, 3]]);

            sheet.setFormula(4, 4, "=SUM(B1,B2");
            sheet.setFormula(5, 5, "=SUM(A1,C3");
            sheet.setFormula(6, 6, "=SUM(A1,A2");

            sheet.addCustomName('customeName1', '=$A$1:$C$3', 0, 0);
            sheet.setFormula(3, 3, "=SUM(customeName1)");
            sheet.isPaintSuspended(false);

            $("#btnSetFormula").click(function () {
                var sheet = spread.getActiveSheet();
                if ($("#formula").val()) {
                    var formula = $("#formula").val();

                    if ($("#rowIndex").val() && $("#columnIndex").val()) {
                        var rowIndex = parseInt($("#rowIndex").val());
                        var columnIndex = parseInt($("#columnIndex").val());

                        if ($("#rowCount").val() && $("#columnCount").val()) {
                            var rowCount = Math.max(parseInt($("#rowCount").val()), 1);
                            var columnCount = Math.max(parseInt($("#columnCount").val()), 1);
                            sheet.setArrayFormula(rowIndex, columnIndex, rowCount, columnCount, formula);
                        }
                        else {
                            sheet.setFormula(rowIndex, columnIndex, formula);
                        }
                    }
                }
            });
        });
    /*code_end*/
    </script>
</head>
<body>
    <div class="sample-turtorial">
        <div id="ss" style="width:100%; height:345px;border: 1px solid gray;"></div>
        <div class="demo-options">
            <div class="option-row">
                <label for="rowIndex">Row Index:</label>
                <input type="text" id="rowIndex"/>
                <label for="columnIndex">Column Index:</label>
                <input type="text" id="columnIndex"/>
            </div>
            <div class="option-row">
                <label for="rowCount">Row Count:</label>
                <input type="text" id="rowCount"/>
                <label for="columnCount">Column Count:</label>
                <input type="text" id="columnCount"/>
            </div>
            <div class="option-row">
                <label for="formula">Formula:</label>
                <input type="text" id="formula" value="=SUM(A1,C2)"/>
                <input type="button" id="btnSetFormula" value="SetFormula" />
            </div>
        </div>
	</div>
</body>
</html>